{namespace v=Tx_Vhs_ViewHelpers}

<f:layout name="Empty" />

<f:section name="main">
<f:comment>
{v:math.median(a: '{v:math.range(a:\'{0:5, 1:2, 2:8, 3:4}\',fail:\'1\')}', fail: '1')}
<f:render partial="Image/ListGps" arguments="{images:images, type:'latitude'}" />
</f:comment>
<div id="map" style="width: 100%; height: 600px"></div>

<script>
var map = L.map('map').setView([43.6, 18.6], 5);

L.tileLayer('https://\{s\}.tiles.mapbox.com/v3/\{id\}/\{z\}/\{x\}/\{y\}.png', {
	maxZoom: 18,
	attribution: '',
	id: 'examples.map-i875mjb7'
}).addTo(map);

<f:for each="{images}" as="post"><f:for each="{post.files}" as="image" iteration="c">
L.marker([{image.originalResource.originalFile.properties.latitude}, {image.originalResource.originalFile.properties.longitude}]).addTo(map)
	.bindPopup("<a href=\"{f:uri.action(action:'show',pageUid:'10',arguments:{image:post},absolute:'1')}\"><h5>{image.originalResource.title}</h5> {image.originalResource.description}</a>");</f:for></f:for>
var popup = L.popup();

map.fitBounds([<f:for each="{images}" as="post"><f:for each="{post.files}" as="image" iteration="c">[{image.originalResource.originalFile.properties.latitude},{image.originalResource.originalFile.properties.longitude}],</f:for></f:for>]);

</script>
</f:section>